<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>{{ title }}</title>
    <style>
        table {
            border-collapse: collapse;
            width: 80%;
            margin: 20px 0;
        }

        th, td {
            border: 1px solid #ddd;
            padding: 12px;
            text-align: left;
        }

        th {
            background-color: #f2f2f2;
        }

        a {
            color: #4CAF50;
            text-decoration: none;
        }

        a:hover {
            text-decoration: underline;
        }

        .add-button {
            display: inline-block;
            padding: 8px 15px;
            background-color: #4CAF50;
            color: white;
            text-decoration: none;
            border-radius: 4px;
        }

        .add-button:hover {
            background-color: #45a049;
            text-decoration: none;
        }
    </style>
</head>
<body>



<h1>{{ title }}</h1>
<p><a href="{% url 'book-add' %}" class="add-button">添加新书籍</a></p>

{% if books %}
    <table>
        <tr>
            <th>书名</th>
            <th>作者</th>
            <th>出版日期</th>
            <th>创建时间</th>
        </tr>
        {% for book in books %}
            <tr>
                <td>{{ book.title }}</td>
                <td>{{ book.author }}</td>
                <td>{{ book.publication_date }}</td>
                <td>{{ book.created_at|date:"Y-m-d H:i" }}</td>
            </tr>
        {% endfor %}
    </table>
{% else %}
    <p>暂无书籍数据，请添加新书籍。</p>
{% endif %}



<!-- 在book_list.html中 -->
{% if books %}
    <p>共有 {{ books|length }} 本图书</p>
{% elif books|length == 0 %}
    <p>暂无图书数据</p>
{% else %}
    <p>数据加载中...</p>
{% endif %}


<!-- 在book_list.html中 -->
<ul>
    {% for book in books %}
        <li>{{ forloop.counter }}. {{ book.title }} - {{ book.author }}</li>
    {% empty %}
        <li>没有找到任何书籍</li>
    {% endfor %}
</ul>


<!-- 倒序显示书籍 -->
{% for book in books reversed %}
    <p>{{ book.title }} ({{ book.publication_date }})</p>
{% endfor %}

{#{% ifequal book.author "未知作者" %}#}
{#    <p>这本书的作者信息未填写</p>#}
{#{% else %}#}
{#    <p>作者: {{ book.author }}</p>#}
{#{% endifequal %}#}


<!-- 生成URL -->
<a href="{% url 'book-add' %}">添加新书籍</a>
<a href="{% url 'book-list' %}">返回书籍列表</a>


<!-- 加载静态文件 -->
{% load static %}
<link rel="stylesheet" href="{% static 'css/style.css' %}">

{% load static %}
<img src="{% static 'images/book.png' %}" alt="书籍图标">


</body>
</html>